import styles from "@pages/home/widgets/channel/styles/edit.module.less";
import Item from "@pages/home/widgets/updateGuestChannel/widgets/unselected/Item";
import { useRequestAllChannelsQuery } from "@service/channel";
import useGuestChannels from "@pages/home/hooks/useGuestChannels";


  
export default function Unselected() {

    // 获取所有频道列表
    const { data: all, isSuccess } = useRequestAllChannelsQuery(undefined);
    // 获取访客频道列表
    const guestChannels = useGuestChannels();
    // 如果所有频道列表没有获取成功, 渲染空
    if (!isSuccess) return null;
    // 获取访客可选频道列表
    const unSelectedChannels = all.data.channels.filter(
        (ac) => typeof guestChannels.find((gc) => gc.id === ac.id) === "undefined"
    );
    return (
        <>
            <div className={styles.title}>
                <h3>可选频道</h3>
            </div>
            <div className={styles.list}>
                {unSelectedChannels.map((channel) => (
                    <Item key={channel.id} channel={channel} />
                ))}
            </div>

        </>
    );
}